import 'package:flutter/material.dart';

/// 2022年更新  适配 flutter 3.0
class ScaffoldPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return ScaffoldPageState();
  }
}

class ScaffoldPageState extends State with SingleTickerProviderStateMixin {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      ///定义页面的标题
      appBar: AppBar(
        title: Text("这里是首页"),
      ),
      ///定义的页面的主体内容
      body:Text(""),
      ///定义的悬浮按钮
      floatingActionButton: FloatingActionButton(
        child: Text("++"),
        ///点击响应事
        onPressed: () {
          print("点击了 FloatingActionButton");
        },
        ///长按提示
        tooltip: "点击了 tooltip s ",
        ///设置悬浮按钮的背景
        backgroundColor: Colors.red,
        ///获取焦点时显示的颜色
        focusColor: Colors.green,
        ///鼠标悬浮在按钮上时显示的颜色
        hoverColor: Colors.yellow,
        ///水波纹颜色
        splashColor: Colors.deepPurple,
        ///定义前景色 主要影响文字的颜色
        foregroundColor: Colors.black,
        ///配制阴影高度 未点击时
        elevation: 0.0,
        ///配制阴影高度 点击时
        highlightElevation: 20.0,
      ),
      ///用来控制  FloatingActionButton 的位置
      ///FloatingActionButtonLocation.endFloat 默认使用 浮动右下角
      ///FloatingActionButtonLocation.endDocked 右下角
      ///FloatingActionButtonLocation.endTop  右上角
      ///FloatingActionButtonLocation.startTop 左上角
      ///FloatingActionButtonLocation.centerFloat 底部中间浮动
      ///FloatingActionButtonLocation.centerDocked 底部中间不浮动
      floatingActionButtonLocation: FloatingActionButtonLocation.endFloat,
      ///浮动按钮下面的标签 Widget
      persistentFooterButtons: <Widget>[
        Text(
          "sxd",
          style: TextStyle(color: Colors.blue),
        ),
        Text("sxd"),
        Text("sxd"),
        Text("sxd"),
        Text("sxd"),
      ],
      ///左侧拉菜单页面
      drawer: Container(
        color: Colors.grey,
        width: 120,
        // child: FlatButton(
        //   child: Text("关闭左滑菜单"),
        //   onPressed: () {
        //     Navigator.of(context).pop();
        //   },
        // ),
      ),
      ///右侧拉菜单页面
      endDrawer: Container(
        color: Colors.yellow,
        width: 200,
        height: 800,
        // child: FlatButton(
        //   child: Text("关闭右滑菜单"),
        //   onPressed: () {
        //     Navigator.of(context).pop();
        //   },
        // ),
      ),
    );
  }
}
